import API from '../../api/movies/api_movies';
import * as echarts from 'echarts'
export default {
    data() {
        return {
            applicationNum: null,
            carouselValue: 0,
            carouselList: [
                {
                    "src": require("@/assets/movies/top_carousel_1.png")
                }
            ],
            scoreList: [
                {
                    "title": "最高分",
                    "value": 9.8,
                    "img": require("@/assets/movies/score-max-img.jpg")
                },
                {
                    "title": "最低分",
                    "value": 2.1,
                    "img": require("@/assets/movies/score-min-img.jpg")
                },
                {
                    "title": "中位数",
                    "value": 5.6,
                    "img": require("@/assets/movies/score-med-img.jpg")
                },
                {
                    "title": "平均分",
                    "value": 5.1,
                    "img": require("@/assets/movies/score-avg-img.jpg")
                }
            ],
        };
    },
    created() {
    },
    methods: {
        initSearch() {
            let that = this;
            API.getMoviesScore({}).then(
                function (r) {
                    if (r && r.code === 200) {
                        that.applicationNum = r.data;
                    } else {
                        that.$Message.error(r.message);
                    }
                },
                function (err) {
                    that.$Message.error(err.toString());
                }
            );
        },
        initEchart() {
            // let that = this;
            let countDateOption = {
                grid: {
                    //与绝对定位相似，top，left，right，bottom 设定是根据上级盒子宽高来计算
                    top: "5%",
                    left: "5%",
                    right: "2%",
                    bottom: "5%"
                },
                xAxis: {
                    type: 'category',
                    // boundaryGap: false,
                    axisLabel: {
                        textStyle: {
                            fontSize: 20,
                            fontWeight: 'bold',
                            color: '#fff'
                        },
                        formatter: function (value) {
                            var texts = value;
                            texts += ('月');
                            return texts;
                        }
                    },
                    data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12']
                },
                yAxis: {
                    type: 'value',
                    splitLine: {
                        show: false
                    },
                    axisLine: {
                        show: true
                    },
                    axisTick: {
                        show: true,
                    },
                    axisLabel: {
                        textStyle: {
                            fontSize: 20,
                            fontWeight: 'bold',
                            color: '#fff'
                        },
                        formatter: function (value) {
                            var texts = value;
                            texts += ('部');
                            return texts;
                        }
                    },
                },
                series: [
                    {
                        data: [20, 32, 91, 34, 12, 33, 20, 34, 12, 20, 32, 34],
                        type: 'line',
                        smooth: true,
                        areaStyle: {
                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                                {
                                    offset: 0,
                                    color: 'rgba(58,77,233,0.8)'
                                },
                                {
                                    offset: 1,
                                    color: 'rgba(58,77,233,0.3)'
                                }
                            ])
                        },
                    }
                ]
            };
            let countDateEchart = echarts.init(document.getElementById('countDate_echart'));
            countDateEchart.setOption(countDateOption, true);
        }
    },
    mounted() {
        // this.initSearch();
        this.initEchart();
    }
};
